<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>add员工</title>
	<link rel="stylesheet" type="text/css" href="js/bootstrap/css/bootstrap.css" />
	<script type="text/javascript" src="js/vue2.5.js"></script>
	<script type="text/javascript" src="js/axios.min.js"></script>
	<script type="text/javascript" src="js/jquery.js"></script>
	<script type="text/javascript" src="js/bootstrap/js/bootstrap.js"></script>
	<script src="js/layer/layer.js"></script>
</head>
<body>
	<div class="container">
	<form id="form1" class="form-horizontal" >
				<div class="form-group">
					<label for="" class="col-sm-2">员工姓名</label>
					<div class="col-sm-8">
						<input type="text" v-model="emp.name" id="name" name="name" placeholder="请输入员工姓名" class="form-control" />
					</div>
				</div>
				
				<div class="form-group">
					<label for="" class="col-sm-2">年龄</label>
					<div class="col-sm-8">
						<input type="text" v-model="emp.age" id="age" name="age" placeholder="请输入年龄" class="form-control" />
					</div>
				</div>
				<div class="form-group">
					<label for="" class="col-sm-2">性别</label>
					<div class="col-sm-8">
						<input type="radio" name="sex" value="男" v-model="emp.sex" > 男
						<input type="radio" name="sex" value="女" v-model="emp.sex" > 女
					</div>
				</div>
				<div class="form-group">
					<label for="" class="col-sm-2">地址</label>
					<div class="col-sm-8">
						<input type="text" v-model="emp.adress" id="adress" name="adress" placeholder="地址" class="form-control" />
					</div>
				</div>
				
				
				
				<div class="form-group">
					<div class="col-sm-offset-2 col-sm-8">
						<input type="button" value="增加员工" class="btn btn-success" id="addBtn" @click="add()"/>
						<input type="button" value="取消" class="btn btn-warning" onclick="history.back();" />
					</div>
				</div>
			</form>
		</div>	
			<script>
			var vue = new Vue({
				el: '.container',
				data: {
					emp: {
						age: '',
						name: '',
						sex: '',
						adress: ''
					}
				},methods: {//增加员工
					add: function() {

						axios.post( "http://localhost:8080/TestSSM"  + '/emp/add',
								 $.param({
										name:$('#name').val(),
										age:$('#age').val(),
										sex :  $("input[name='sex']:checked").val(),
										adress: $('#adress').val()
									})
								
						)
							.then(function(response) {
								layer.msg('成功');
								location.href="query.html";
							}.bind(this))
							.catch(function(error) {
								layer.msg('请求失败');
							});
						
					}
				},
				mounted: function() {
					
				}

			});
			</script>
</body>
</html>